<template>
  <a-card :bordered="false">
    <a-spin :spinning="confirmLoading">
      <a-form-model
        ref="ruleForm"
        :model="formInfo"
        :label-col="$global.labelCol"
        :wrapper-col="$global.wrapperCol"
      >
        <a-row>
          <a-col :span="8">
            <a-form-model-item
              label="标题"
              prop="title"
              ref="title"
              :rules="$valid.required"
              :maxLength="50">
              <a-input v-model="formInfo.title" placeholder="请输入标题"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item
              label="消息类型"
              prop="msgCategory"
              ref="msgCategory"
              :rules="$valid.required"
              :maxLength="50">
              <a-select
                v-model="formInfo.msgCategory"
                placeholder="请选择消息类型"
                :disabled="disableCatalog">
                <a-select-option
                  v-for="(item) in this.$sysDictOptions('msgCategory')"
                  :key="item.k"
                  :value="parseInt(item.k)">
                  {{ item.v }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item
              label="摘要"
              prop="shorter"
              ref="shorter"
              :maxLength="499">
              <a-input v-model="formInfo.shorter" placeholder="请输入摘要"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item
              label="优先级"
              prop="priority"
              ref="priority"
              :maxLength="50">
              <a-select v-model="formInfo.priority" placeholder="请选择优先级">
                <a-select-option
                  v-for="(item) in this.$sysDictOptions('priority')"
                  :key="item.k"
                  :value="parseInt(item.k)">
                  {{ item.v }}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item
              label="接收部门"
              prop="departManagerCode">
              <depart-window-show
                :multiple-flag="true"
                :org-flag="-1"
                :checkedDepartKeys="departManagerCode"
                @ok="departOk"
              ></depart-window-show>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-form-item
            label="内容"
            prop="content"
            ref="content"
            :labelCol="{
              xs: { span: 2 },
              sm: { span: 2 }
            }"
            :wrapperCol="{
              xs: { span: 22 },
              sm: { span: 22 }
            }"
          >
            <tinymce-editor
              triggerChange
              :value="formInfo.content"
              @change="editorOk"></tinymce-editor>
          </a-form-item>
          <a-row>
            <a-col :span="24">
              <a-form-item
                label="内容"
                prop="content"
                ref="content"
                :labelCol="{
                  xs: { span: 2 },
                  sm: { span: 2 }
                }"
                :wrapperCol="{
                  xs: { span: 22 },
                  sm: { span: 22 }
                }"
              >
                <w-file-upload
                  class="avatar-uploader"
                  text="上传"
                  :pdfOnly="true"
                  :multipleFlag="true"
                  v-model="formInfo.annexUrl"
                  bizPath="annexUrl"
                  @ok="uploadOk"
                >
                </w-file-upload>
                (*支持格式:pdf)
              </a-form-item>
            </a-col>
          </a-row>
        </a-row>
      </a-form-model>
    </a-spin>
    <footer-tool-bar>
      <a-button
        v-if="$route.query.id"
        @click="$router.go(-1)"
        :style="{ marginRight: '8px' }"
        icon="rollback">返回
      </a-button>
      <a-button
        html-type="submit"
        @click="handleSubmit"
        type="primary">提交
      </a-button>
    </footer-tool-bar>
  </a-card>
</template>

<script>
import { getAction, postAction } from '@/api/manage'
import TinymceEditor from '@/components/Editor/TinymceEditor'
import DepartWindowShow from '@/components/WxDepartChoose/DepartWindowShow'
import WFileUpload from '@/components/WxFileUpload/WFileUpload'
import FooterToolBar from '@/components/FooterToolbar'

export default {
  name: 'NoticeModalEdit',
  components: { TinymceEditor, DepartWindowShow, FooterToolBar, WFileUpload },
  data () {
    return {
      visible: false,
      confirmLoading: false,
      departManagerCode: '',
      disableCatalog: false,
      formInfo: {
        departManagerCode: '',
        title: '',
        id: this.$route.query.id,
        msgCategory: undefined,
        shorter: '',
        priority: undefined,
        annexUrl: undefined
      },
      url: {
        saveInfo: '/system/sysNotice/save',
        getInfo: '/system/sysNotice/info'
      }
    }
  },
  created () {
  },
  mounted () {
    this.edit()
  },
  methods: {
    edit () {
      if (this.formInfo.id) {
        getAction(this.url.getInfo, { id: this.formInfo.id }).then(res => {
          this.$nextTick(() => {
            this.disableCatalog = true
            this.$refs.ruleForm.resetFields()
            this.formInfo = (res.result.data)
            console.log(this.formInfo.departManagerCode)
            this.departManagerCode = this.formInfo.departManagerCode
          })
        })
      }
      this.visible = true
    },
    // 确定
    handleSubmit () {
      // 触发表单验证
      this.confirmLoading = true
      this.$refs.ruleForm.validate(valid => {
        console.log(valid)
        if (valid) {
          this.formInfo.departManagerCode = this.departManagerCode
          this.formInfo.createBy = undefined
          this.formInfo.createTime = undefined
          postAction(this.url.saveInfo, this.formInfo).then(res => {
            this.$refs.ruleForm.resetFields()
            this.$message.success(res.content)
            this.visible = false
            this.$emit('ok', this.formInfo)
            this.$router.push({ name: 'notice' })
          }).finally(() => {
            this.confirmLoading = false
          })
        } else {
          this.confirmLoading = false
        }
      })
    },
    // 关闭
    handleCancel () {
      this.close()
    },
    close () {
      this.$refs.ruleForm.resetFields()
      this.$objToReset(this.formInfo)
      this.departManagerCode = ''
      this.$emit('close')
      this.visible = false
    },
    editorOk (val) {
      this.formInfo.content = val
    },
    departOk (val) {
      this.departManagerCode = val
      console.log('this.formInfo.departManagerCode=' + this.departManagerCode)
    },
    uploadOk () {
      console.log(this.formInfo.annexUrl)
    }
  }
}
</script>
